<template>
  <view>
    <view class="panel">
      <view class="panel-view flex-sb">
        <view class="icon-view flex-sb m-l50">
          <view class="flex-d-c" @click="popupState.share = true">
            <image class="square-50" src="@/static/images/public/share.png" />
            <text class="text-500-128">分享</text>
          </view>
          <view class="flex-d-c" @click="handleSelect">
            <image v-if="position.sc_status === 1" class="square-50" src="@/static/images/public/uncollect.png" />
            <image v-else class="square-50" src="@/static/images/public/collect.png" />
            <text class="text-500-128">{{ position.sc_status === 1 ? '已收藏' : '收藏' }}</text>
          </view>
          <view class="flex-d-c" data-url="pages/dasfsaa" @click="goto">
            <image class="square-50" src="@/static/images/public/complaint.png" />
            <text class="text-500-128">投诉</text>
          </view>
        </view>

        <RcButton :width="192" :top="0" :size="28" :disabled="position.td_status == 1"
          :text="position.td_status === 0 ? '投递简历' : '已投递'" @click="openSendPopup" />
      </view>
    </view>
    <up-popup :show="popupState.send" mode="center" round="20rpx" @close="closeSendPopup">
      <ApplyResume @cancel="closeSendPopup" @confirm="handleSendPopupConfirm" />
    </up-popup>
    <up-popup :show="popupState.share" mode="bottom" round="20rpx" closeable @close="popupState.share = false">
      <BottomShare @cancel="popupState.share = false" />
    </up-popup>
  </view>
</template>

<script lang="ts" setup>
import { defineEmits, defineProps, reactive } from 'vue'
import RcButton from '@/components/button.vue'
import ApplyResume from './apply-resume'
import BottomShare from './bottom-share'
import { useNavigator } from '@/hooks/use-navigator'
import type { Office } from '@/types/api.d.ts'

const { goto } = useNavigator()

const props = defineProps<{
  position: Office;
}>()

const emit = defineEmits<{
  (e: 'refresh'): void;
}>()

const popupState = reactive({
  share: false,
  send: false,
})

const handleSelect = () => {
  uni.showLoading({ mask: true })
  // 收藏 /position/addsc
  // 取消收藏 /position/delsc
  const url = props.position.sc_status === 1 ? '/position/delsc' : '/position/addsc'
  uni.$u.post(url, { position_id: props.position.id }).then((res) => {
    uni.$u.toast(res.msg)
    if (res.code === 1) {
      emit('refresh')
    }
  }).finally(() => {
    uni.hideLoading()
  })
}

// 投递简历提示弹窗 - 打开
const openSendPopup = () => {
  if (props.position.td_status == 1) return
  popupState.send = true

}

// 投递简历提示弹窗 - 关闭
const closeSendPopup = () => {
  popupState.send = false
}

// 投递简历提示弹窗 - 确认
const handleSendPopupConfirm = () => {
  popupState.send = false
  postJob()
}

// 投递简历
const postJob = () => {
  uni.showLoading({ mask: true })
  uni.$u.post('/position/addtd', { position_id: props.position.id }).then((res) => {
    uni.$u.toast(res.msg)
    if (res.code === 1) {
      emit('refresh')
    }
  }).finally(() => {
    uni.hideLoading()
  })
}
</script>

<style lang="scss" scoped>
.panel {
  height: 180rpx;
}

.panel-view {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 168rpx;
  padding-right: 24rpx;
  background-color: $bg-color-1;
  border-top: 1rpx solid #E0E0E0;
}

.icon-view {
  width: 310rpx;
}
</style>
